<!DOCTYPE html>
<html>
  <head>
    <title>City Scout</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <link rel="stylesheet" href="css/bootstrap.css" />
    <link rel="stylesheet" href="css/edit.css" />
    <script type="text/javascript">
    var setNumRoute = function(){
    	  $('#transport form div').empty();
        var amount = $('#transport select option:selected').val();
        for (var i=0; i<amount; i++){
        	  $('#transport form div').append('<p>Route Number: </p><input type="">');
        	  $('#transport form div').append('<p>Route Name: </p><input type="">');
            }
        }
    </script>
  </head>
  <body>
  
      <div class="navbar navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
          <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </a>
          <a class="brand" href="/" style="color: #c7201a">City Scout</a>
          <div class="nav-collapse">
            <ul class="nav">
              <li><a href="/">Home</a></li>
              <li><a href="/map">Map</a></li>
              <li><a href="#">About</a></li>
              <li><a href="//docs.google.com/a/bolshchikov.net/spreadsheet/viewform?formkey=dGI0bTNCVkxhaDBWNGRVd3dnVktCbnc6MQ" target="_blank">Join</a></li>
              <li><a href="mailto:sergey@bolshchikov.net" target="_blank">Contact</a></li>
            </ul>
          </div><!--/.nav-collapse -->
          <form class="navbar-search pull-left">
            <input type="text" class="search-query" placeholder="Search">
          </form>
        </div>
      </div>
    </div>
  
    
    <div class="row">
      <div id="dept" class="well span3">
        <h2>Add Department</h2>
        <form>
          <p>ID: </p><input type="text"/>
          <p>Name: </p><input type="text" />
          <p>Address: </p><input type="text" />
          <p>Link: </p><input type="text" />
          <br /><br />
        </form>
        <input class="btn btn-danger btn-large" type="button" value="Submit" onclick="addDept()"/>
      </div>
      
      <div id="lab" class="well span3">
        <h2>Add Laboratory</h2>
        <form>
          <p>ID: </p><input type="text" />
          <p>Name: </p><input type="text" />
          <p>Address: </p><input type="text" />
          <p>Link: </p><input type="text" />
        </form>
        <input class="btn btn-danger btn-large" type="button" value="Submit" onclick=""/>
      </div>
      
      <div id="facility" class="well span3">
        <h2>Add Facility</h2>
        <form>
          <p>ID: </p><input type="text" />
          <p>Name: </p><input type="text" />
          <p>Address: </p><input type="text" />
        </form>
        <input class="btn btn-danger btn-large" type="button" value="Submit" onclick=""/>
      </div>
      
      <div id="transport" class="well span3">
        <h2>Add Transport</h2>
        <form>
          <p>ID: </p><input type="text" />
          <p>Name: </p><input type="text" />
          <p>Amount of Routes: </p>
          <select onchange="setNumRoute();">
            <option value="0">0</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
          </select>
          <div></div>
        </form>
        <input class="btn btn-danger btn-large" type="button" value="Submit" onclick=""/>
      </div>
    </div>
    
    
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script src="js/bootstrap.js"></script>
    <script src="js/map.js"></script>
    <script src="js/request.js"></script>
    <script src="js/action.js"></script>
    <script src="js/json.js"></script>
  </body>
</html>